<%@ page language="java"  pageEncoding="UTF-8"%>
<%@ include file="/views/commons/taglibs.jsp" %>
<!DOCTYPE xmlns="http://www.w3.org/1999/xhtml">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
		<meta content="black" name="apple-mobile-web-app-status-bar-style"/>
		<meta content="telephone=no" name="format-detection"/>
<title>商品详情</title>
<script type="text/javascript">
		(function() {
			var el = document.createElement("STYLE");
			var docEl = document.documentElement;
			var portrait = ((Math.min(docEl.clientWidth, docEl.clientHeight) / 320) * 10);
			var landscape = ((Math.max(docEl.clientWidth, docEl.clientHeight) / 568) * 17.75);
			el.innerHTML = "@media screen and (orientation:portrait) { html { font-size: " + portrait + "px!important; } }\n@media screen and (orientation:landscape) { html { font-size: " + landscape + "px!important; } }";
			docEl.firstElementChild.appendChild(el);
		})();
</script>
<link href="<%=path %>/css/stlye.css" rel="stylesheet" type="text/css" />
<script src="<%=path%>/js/jquery-1.11.0.min.js"></script>
</head>
<body style="background-color:#f4f4f4;">

  <div class="xiangqing_top"><img src="<%=path %>/uncheck/pictures/servlet?id=${goods.goodsBigImg}"  width="100%;" height=""/></div>

<div class="xiangqing_biaot">

   <div class="xiangqing_biaot_top">${goods.goodsName}</div>
   
   <div class="xiangqing_biaot_bottom">
       <h1>￥${goods.goodsPrice}</h1>
       <p>现价：0元</p>
       <span>已领取${goods.buyNum}人次</span>
   </div>

</div>

<c:if test="${not empty propertiesName && not empty propertiesList}">
<div class="xiangqing_shuxing">
   <div class="xiangqing_shuxing_xuanz">
   		 选择${propertiesName}
   </div>
   <ul>
   	 <c:forEach items="${propertiesList}" var="properties">
     	<li style="margin-left:1rem;margin-top:0.5rem ">${properties}</li>
     </c:forEach>
  </ul>
</div>
</c:if>

<div class="xiangqing_bottom">
    <h1 onclick="javascript:showInfo('step_info')">领取步骤</h1>
    <h2 onclick="javascript:showInfo('introduce_info')">图文介绍</h2>
</div>

<div class="lingqubuzou" id="step_info">  

1.分享商品至朋友圈；<br/>
2.填写您的收货信息；<br/>
3.通过微信支付人工运费即可完成领取。<br/>
注：每人限领一件

</div>
<div class="lingqubuzou" id="introduce_info" style="display:none;">  
	<fns:encodes value="${goods.goodsIntroduce}" type="4"/>
</div>
<div class="xiangqing_zbottom">立即领取</div>
</body>
<script type="text/javascript">
	function showInfo(divId){
		if(divId=='step_info'){
			$("#step_info").show();
			$("#introduce_info").hide();
		}else if(divId=='introduce_info'){
			$("#step_info").hide();
			$("#introduce_info").show();
		}
	}
</script>
</html>